//help.js
Component({
	options: {
		multipleSlots: true // 在组件定义时的选项中启用多slot支持
	},
	/*组件的属性列表*/
	properties: {
		title: { // 属性名
			type: String, // 类型（必填），目前接受的类型包括：String, Number, Boolean, Object, Array, null（表示任意类型）
			value: '标题' // 属性初始值（可选），如果未指定则会根据类型选择一个
		},
	},
	/* 组件的初始数据*/
	data: {
		flag: true,
		showModalStatus: false //弹出框状态
	},
	/*组件的方法列表*/
	methods: {
		powerDrawer: function(e) {
			if(e){
				//判断是父级调用的还是按键触发的
				//显示弹出框
				var currentStatu = e.currentTarget.dataset.statu;
				this.util(currentStatu)
			}else{
				//显示弹出框
				var currentStatu = "open"
				this.util(currentStatu)
			}
		},
		util: function(currentStatu) {
			/* 动画部分 */
			// 第1步：创建动画实例  
			var animation = wx.createAnimation({
				duration: 300, //动画时长 
				timingFunction: "linear", //线性 
				delay: 0 //0则不延迟 
			});

			// 第2步：这个动画实例赋给当前的动画实例 
			this.animation = animation;

			// 第3步：执行第一组动画 
			animation.opacity(0).rotateY(100).step();

			// 第4步：导出动画对象赋给数据对象储存 
			this.setData({
				animationData: animation.export()
			})

			// 第5步：设置定时器到指定时候后，执行第二组动画 
			setTimeout(function() {
				// 执行第二组动画 
				animation.opacity(1).rotateY(0).step();
				// 给数据对象储存的第一组动画，更替为执行完第二组动画的动画对象 
				this.setData({
					animationData: animation
				})

				//关闭 
				if (currentStatu == "close") {
					this.setData({
						showModalStatus: false
					});
				}
			}.bind(this), 200)

			// 显示 
			if (currentStatu == "open") {
				this.setData({
					showModalStatus: true
				});
			}
		}
	}
})
